<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>页面</title>
		<style type="text/css">
			#header {
				height: 200px;
				width: 100%;
				background-color: #1E2934;
				color: white;
			}

			div {
				float: left;
			}

			#blank {
				width: 200px;
				height: 200px;
			}
			#inner{
				margin: 0px 150px;
			}

			#menuTop {
				height: 150px;
				width: 400px;
			}
			#menuTop {
				clear: both;
			}

			#menuBottom {
				clear: both;
				margin-left: 190px;
			}

			#midPage {
				width: 100%;
				height: 10000px;
				clear: both;
				background-image: url(img/bg1.png);

			}

			#footer {
				background-image: url(img/bg1.png);
				width: 100%;
				height: 500px;
			}

			#midPic {
				margin: 0px auto;
				clear: both;
				padding: 0px 150px;
			}

			#midFunction {
				clear: both;
				margin: 30px 150px 30px 150px;
			}

			#FunctionIntroduce {
				height: 100px;
				width: 600px;
				margin-right: 200px;
			}

			.button {
				background-color: #4CAF50;
				border-radius: 5px;
				border: none;
				color: white;
				padding: 15px 32px;
				text-align: left;
				text-decoration: none;
				display: inline-block;
				font-size: 16px;
				margin: 4px 2px;
				cursor: pointer;
			}

			#button1 {
				padding-right: 53px;
			}

			.functionBlank {
				height: 200px;
			}

			#jiange {
				margin: 50px 150px 20px;
				clear: both;
				height: 100px;
				width: 1000px;
				border-top: solid 1px #9fa9b3;
				border-bottom: solid 1px #9fa9b3;
			}

			#midTop {
				width: 1000px;
				height: 100px;
			}
			#logo{
				margin: 150px 0px 20px 0px;
			}
			p {
				font-size: 16px;
			}

			#button1:hover {
				background-color: #F33;
			}

			#button2:hover {
				background-color: #000;
			}

			#left {
				width: 45%;
			}

			#right {
				float: right;
				width: 45%;
			}

			#shang {
				clear: both;
				margin: 0px 150px;
			}

			#xia {
				clear: both;
			}

			.text1 {
				color: #97a4b0;
			}
			#a1{
				display: block;
				height: 100%;
				weight:100%;	
			}

			input {
				width: 40%;
				border-radius: 2px;
				margin-right: 5px;
				border: #1E2934 solid 1px;
				padding: 10px;
				float: left;
			}

			.SubButton {
				float: left;
				background-color: #1E2934;
				color: #FFFFFF;
				font-size: 14px;
				padding: 10px 10px;
				border-radius: 2px;
			}

			span {
				margin: 30px 0px;
			}

			li:hover {
				color: #45c7d3
			}
			.li2{
				display:block;
				margin:0px 0px 10px 0px;
			}
			ul {
				list-style-type: none;
				margin: 0;
				padding: 0;
			}

			li {
				display: inline;
				margin: 5px 9px 0px;
			}
		</style>
	</head>
	<body>
		<div id="header">
			<div id="inner">
				<div id="logo">
					<a id="a1" href="#">
						<img src="img/themeraid-logo.png" width="128px" height="21px" />
					</a>
				</div>
				<div id="blank"></div>
				<div id="menu">
					<div id="menuTop"></div>
					<div id="menuBottom">
						<ul>
							<li>Home</li>
							<li>Themes</li>
							<li>Features</li>
							<li>Plugins</li>
							<li>Photos</li>
						</ul>
					</div>

				</div>
			</div>
		</div>
		<div id="midPage">
			<div id="midTop"></div>
			<div id="midPic">
				<img src="img/themeraid.jpg" />
			</div>
			<div id="midFunction">
				<div id="FunctionIntroduce">
					<p>Letter landscape / horizontal brochure mockup template for presenting your design in a realistic
						with no way. You can get the free version or the premium high resolution version.</p>
				</div>
				<div id="functionBlank"></div>
				<div id="functionButton">
					<button id="button1" class="button">Free Dowland</button><br />
					<button id="button2" class="button">Premium Version</button>
				</div>
			</div>
			<div id="footer">
				<div id="jiange"></div>
				<div id="kuangjia">
					<div id="shang">
						<div id="left">
							<a class="text1">Subscribe to our newsletter</a><br /><br /><br />
							<a>Subscribe to our newsletter to receive news, updates, free stuff and new releases by email. We don't do spam.</a>
							<br />
							<br />
							<br />
							<form action="#" method="post">
								<input type="text" name="searchText2" value="">
								<input class="SubButton" type="submit" value="Subcribe" />
							</form>
						</div>
						<div id="right">
							<a class="text1">Latest from the Blog</a>
							<br />
							<br />
							<br />
							<ul>
								<li class="li2">Funny Graphic Design Posters</li>
								<li class="li2">How to Fix Custom Post Type 404 Error</li>
								<li class="li2">Free One Page Html Website Templates</li>
								<li class="li2">Best Html Admin Panel Templates</li>
								<li class="li2">In-place Editable Html Invoice</li>
							</ul>
						</div>
					</div>
					<div id="xia">
					</div>
				</div>
			</div>
		</div>


	</body>
</html>
